<script setup lang="ts">
import { wxConfig } from '@/api/modules/wx'
import { ref } from 'vue'
const loading = ref(false)
const errorMsg = ref('')


const getuserinfo = async () => {
  try {
    loading.value = true
    errorMsg.value = ''
    
    // 使用axios请求获取appId
    // const res:any=await wxConfig({url:window.location.href})
    let appId = localStorage.getItem('appId')
    if(!localStorage.getItem('appId')){
        const res:any=await wxConfig({url:window.location.href})
        appId=res.appId;
    }
    if (appId) {
      const query = new URLSearchParams(window.location.search)
      const redirect = query.get('redirect') || '/' 
      const temp = decodeURIComponent(redirect).includes('/login') ? '/' : redirect
      const host = window.location.protocol + "//" + window.location.host
      const url = host + temp
      window.location.href = `https://open.weixin.qq.com/connect/oauth2/authorize?appid=${appId}&redirect_uri=${url}&response_type=code&scope=snsapi_userinfo&state=STATE#wechat_redirect`
    } else {
      throw new Error('获取appId失败')
    }
  } catch (error: any) {
    console.error('获取appId失败:', error)
  } finally {
    loading.value = false
  }
}

</script>

<template>
    <div class="loginBox">
		<div class="logoBox">
			<img src="/img/logo.jpg" class="logo" />
		</div>
		<div class="btn">
			<button @click="getuserinfo">微信登录</button>
		</div>
	</div>
</template>

<style scoped lang="scss">
    .loginBox{
        height: auto;
        overflow: hidden;
        .logoBox{
            text-align: center;
            height: auto;
            overflow: hidden;
            margin-top: 100px;
            .logo{
                width: 120px;
                height: 120px;
            }
        }
        .btn{
            position: fixed;
            bottom: 200px;
            left: 0;
            right: 0;
            padding: 0 40px;
            button{
                background: #1AAD19;
                width: 100%;
                color: #fff;
                outline: none;
                border: #1AAD19 solid 1px;
            }
        }
    }
</style>